<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
	<title>Li Liang's Tweet Feed</title>
	<style type="text/css">
		* {
			font-family:calibri, verdana, Arial;
		}

		input {
			padding:0.5em;
		}

		label {
			display:inline-block;
			width:150px;
		}

		form > div {
			margin: 0.5em 0px;
		}
		
		#error {
			color:red;
		}
		
		#feed-url {
			font-size:150%;
		}
	</style>
  </head>
  <body>
	<div>
		{% if feed_url %}
			<div id='feed-url'>Here is the Twitter Friend Status Feed:<br><a href='{{feed_url}}'>{{feed_url}}</a></div>
		{% else %}
			{%if error%}<div id="error">Error: {{error}}!</div>{%endif%}
			<form action="." method="post">
				<div><label>Twitter Username:</label><input id='username-box' type="text" name="username" value="{{username}}" /></div>
				<div><label>Twitter Password:</label><input id='password-box' type="password" name="password" value="{{password}}"  /></div>
				<div><input type="submit" value="Get Feed URL" /><div>
			</form>
		{% endif %}
	</div>
	<script type='text/javascript'>
		document.getElementById('username-box').focus();
	</script>
  </body>
</html>
